<style>
    .jstree-default .jstree-disabled {
        color: #BBBBBB;
    }
    .label-grey {
        background-color: #BBBBBB;
    }
    .form-commonsearch .form-group {
        margin-left: 0;
        margin-right: 0;
        padding: 0;
    }
    form.form-commonsearch .control-label {
        padding-right: 0;
    }
    .tdtitle {
        margin-bottom: 5px;
        font-weight: 600;
    }
    #channeltree {
        margin-left: -6px;
    }
    #channelbar .panel-heading {
        height: 55px;
        line-height: 25px;
        font-size: 14px;
    }
    @media (max-width: 1230px) {
        .fixed-table-toolbar .search .form-control {
            display: none;
        }
    }
    @media (min-width: 1200px) {
        }
    .archives-label span.label {
        font-weight: normal;
    }
    .archives-title {
        max-width: 400px;
        min-width: 200px;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .setflag label {
        font-weight: 400;
    }
    .nav > li.toggle-channel {
        display: none;
    }
    .col-full-width .nav > li.toggle-channel {
        display: inline-block;
    }
</style>
<div class="row">
    <div class="col-md-3 hidden-xs hidden-sm" id="channelbar" style="padding-right:0;">
        <div class="panel panel-default panel-intro">
            <div class="panel-heading">
                <div class="panel-lead">
                    <div class="pull-left">
                        <em>{:__('Column list')}</em>
                    </div>
                    <div class="pull-right">
                        <a href="javascript:;" class="btn btn-link btn-xs btn-channel hidden-xs hidden-sm"><i class="fa fa-bars"></i></a>
                    </div>
                </div>
            </div>
            <div class="panel-body">
                <span class="text-muted"><input type="checkbox" name="" id="checkall" /> <label for="checkall"><small>{:__('Check all')}</small></label></span>
                <span class="text-muted"><input type="checkbox" name="" id="expandall" checked="" /> <label for="expandall"><small>{:__('Expand all')}</small></label></span>
                <div id="channeltree"></div>
            </div>
        </div>
    </div>

    <div class="col-xs-12 col-md-9" id="archivespanel">
        <div class="panel panel-default panel-intro" style="background: #f1f4f6;padding-top: 0;padding-bottom: 0;box-shadow: none;">
            <div class="panel-heading">
                {:build_heading(null,FALSE)}
                <ul class="nav nav-tabs" data-field="status">
                    <li class="toggle-channel"><a href="javascript:;" class="btn-channel"><i class="fa fa-bars"></i></a></li>
                    <li class="active"><a href="#t-all" data-value="" data-toggle="tab">{:__('All')}</a></li>
                    {foreach name="statusList" item="vo"}
                    <li><a href="#t-{$vo}" data-value="{$key}" data-toggle="tab">{$vo}</a></li>
                    {/foreach}
                </ul>
            </div>

            <div id="myTabContent" class="tab-content" style="background:#fff;padding:15px;">
            <div class="tab-pane fade active in" id="one">
                <div class="widget-body no-padding">
                    <div id="toolbar" class="toolbar">
                        <a href="javascript:;" class="btn btn-primary btn-refresh" title="{:__('Refresh')}" ><i class="fa fa-refresh"></i> </a>
                        <a href="javascript:;" class="btn btn-success btn-add {:$auth->check('wwh/archives/add')?'':'hide'}" title="{:__('Add')}" ><i class="fa fa-plus"></i> {:__('Add')}</a>
                        <a href="javascript:;" class="btn btn-success btn-edit btn-disabled disabled {:$auth->check('wwh/archives/edit')?'':'hide'}" title="{:__('Edit')}" ><i class="fa fa-pencil"></i> {:__('Edit')}</a>
                        <a href="javascript:;" class="btn btn-danger btn-del btn-disabled disabled {:$auth->check('wwh/archives/del')?'':'hide'}" title="{:__('Delete')}" ><i class="fa fa-trash"></i> {:__('Delete')}</a>
                        <a href="javascript:;" class="btn btn-info btn-audit btn-disabled disabled {:$auth->check('wwh/archives/audit')?'':'hide'}" title="{:__('批量审核')}" ><i class="fa fa-check"></i> {:__('批量审核')}</a>
                    </div>
                    <table id="table" class="table table-striped table-bordered table-hover table-nowrap"
                           data-operate-edit="{:$auth->check('wwh/archives/edit')}"
                           data-operate-del="{:$auth->check('wwh/archives/del')}"
                           data-operate-faudit="{:$auth->check('wwh/archives/faudit')}"
                           width="100%">
                    </table>
                </div>
            </div>

        </div>
    </div>
</div>
</div>